<template>
  <!-- 报关货值配置 -->
  <VPage>
    <VTable ref="tableRef" v-bind="tableOptins">
      <template #form="{ form }">
        <XForm :fieldList="fieldList" :formData="form">
          <template #user="{ value, input }">
            <VCascader
              :model-value="value"
              @update:model-value="input"
              collapse-tags
              style="width: 200px"
              placeholder="创建人"
            />
          </template>
        </XForm>
      </template>
      <template #toolbar_btns>
        <VActionBar :actions="actions" />
      </template>
    </VTable>
    <Coefficient
      v-model="coefficientVisible"
      :coefficientData="coefficientData"
      :options="optionsData"
      @close="coefficientData = {}"
    />
    <DerivedCenter ref="DerivedCenterRef"></DerivedCenter>
    <Details v-model="detailsVisible" ref="detailsRef" :options="optionsData"/>
    <Import-dialog ref="importDialogRef" @refresh="refresh" />
  </VPage>
</template>
<script setup lang="jsx">
import { ElMessage } from "element-plus";
import XForm from "@/components/XForm/index.vue";
import { config_name } from "@/config/export.js";
import Coefficient from "./components/coefficient/index";
import Details from "./components/details/index";
import { getDeclareValueConfig, getDeclareValue } from "./api.js";
import ImportDialog from "@/components/importDialog/index.vue";
import DerivedCenter from "@/components/DerivedCenter/index.vue";
import { optDeclareCompany } from "@/api/index";
import { exportRebatesAuthList } from "@/Auth/export-rebates.js";
const optionsData = ref({});
const tableRef = ref();
const tableOptins = reactive({
  formConfig: {
    data: {
      dateRange: { type: "create_time", value: [], range: false }, // 组合+日期范围
    },
  },
  tooltipConfig: {
    showAll: false,
  },
  isToggle: true,
  columns: [
    { fixed: "left", width: 50, type: "checkbox" },
    {
      fixed: "left",
      title: "采购单号",
      minWidth: 120,
      field: "purchase_number",
    },
    {
      title: "sku",
      fixed: "left",
      minWidth: 200,
      field: "sku",
    },
    { title: "采购未税价", minWidth: 160, field: "purchase_un_tax_amount" },
    { title: "指定系数", minWidth: 160, field: "sp_ratio" },
    { title: "申报货值", minWidth: 160, field: "declare_value" },
    { title: "人员信息", minWidth: 120, field: "create_user" },
    { title: "时间信息", minWidth: 120, field: "create_time" },
  ],
  proxyConfig: {
    autoLoad: false, // 是否自动加载查询数据
    props: {
      result: "data",
      total: "total",
    },
    ajax: {
      query: ({ page, form }) => {
        return getDeclareValue({ ...form, ...page }).then((res) => {
          return {
            data: res.data,
            total: res.total,
          };
        });
      },
    },
  },
});
const getDeclareCompany = async () => {
  const { data } = await optDeclareCompany();
  optionsData.value.declareCompany = data || [];
};
getDeclareCompany()
const refresh = () => {
  tableRef?.value.$table.commitProxy("query");
};
const publicStyle = { style: { width: "240px" } };
const fieldList = [
  {
    field: "purchase_number",
    type: "input",
    placeholder: "采购单号",
    ...publicStyle,
  },
  {
    field: "sku",
    placeholder: "SKU",
    type: "input",
    ...publicStyle,
  },
  {
    field: "dateRange",
    type: "dateTimeRange",
    style: { width: "360px" },
    selectStyle: { width: "100px" },
    select: [{ label: "添加时间", value: "create_time" }],
    itemProps: {
      startPlaceholder: "最早时间",
      endPlaceholder: "最晚时间",
    },
  },
  {
    field: "user",
    selectStyle: { width: "100px" },
    select: [{ label: "添加人", value: "create_user" }],
    options: {
      placeholder: "请选择",
    },
    slot: "user",
  },
];
//导出中心
const DerivedCenterRef = ref();
const handleExport = async () => {
  let condition = getTableSelectRow(tableRef.value);
  DerivedCenterRef.value.open({
    tag_name: config_name["export_rebates"]["out_ps_declare_value"],
    condition,
  });
};
const importDialogRef = ref();
const handleImport = () => {
  importDialogRef.value?.open({
    type: "out.psDeclareValue",
    urlType: "/out/ps-declare-value/import",
  });
};
const coefficientVisible = ref(false);
const coefficientData = ref({});
const handleCoefficient = async () => {
  const { data } = await getDeclareValueConfig();
  coefficientData.value = data || {};
  coefficientVisible.value = true;
};
const detailsVisible = ref(false);
const detailsRef = ref();
const handleDetails = () => {
  detailsVisible.value = true;
  detailsRef.value?.handleRefresh();
};
const actions = [
  {
    label: "供应商报关配置",
    type: "primary",
    fn: handleDetails,
    permission: [exportRebatesAuthList.customs_config.supplier_customs],
  },
  {
    label: "报关货值系数配置",
    type: "primary",
    fn: handleCoefficient,
    permission: [exportRebatesAuthList.customs_config.declaration_customs],
  },
  {
    label: "导入",
    right: true,
    dkicon: "icon-Download",
    fn: handleImport,
    permission: [exportRebatesAuthList.customs_config.import],
  },
  {
    label: "导出",
    right: true,
    dkicon: "icon-ArrowDown",
    fn: handleExport,
    permission: [exportRebatesAuthList.customs_config.export],
  },
];
</script>
